<template>
  <div id="batchList">
    <!-- 上部搜索条件 -->
    <topSearch :form-inline="formInline" @toSearch="toSearch"></topSearch>
    <!-- 操作按钮部分 -->
    <div class="table-conBtn">
      <el-button
        v-permission="'wh:integralList:unfreezingMultiple'"
        type="warning"
        plain
        @click="unfreezingMultiple"
      >
        批量解除冻结
      </el-button>
      <el-button
        v-permission="'wh:integralList:frozenMultiple'"
        type="warning"
        @click="importBtn('frozen')"
      >
        批量冻结积分
      </el-button>
      <el-button
        v-permission="'wh:integralList:updateMultiple'"
        type="warning"
        @click="importBtn('integral')"
      >
        批量修改积分
      </el-button>
      <freshCom @searchList="searchList"></freshCom>
    </div>
    <!-- 表格部分 -->
    <el-table
      id="share-box"
      v-loading="loading"
      :data="tableData"
      style="width: 100%"
      @selection-change="handleSelectionChange"
      max-height="490"
      ref="table"
    >
      <el-table-column
        type="selection"
        width="55"
        :selectable="selectAble"
      ></el-table-column>
      <el-table-column type="index" width="50" label="序号">
        <template slot-scope="scope">
          {{
            scope.$index
              | filterPage(searchParams.pageNum, searchParams.pageSize)
          }}
        </template>
      </el-table-column>
      <el-table-column
        prop="dpAccountUser.userName"
        label="昵称"
        width="150"
      ></el-table-column>
      <el-table-column
        prop="dpAccount"
        label="大鹏号"
        min-width="180"
      ></el-table-column>
      <el-table-column prop="collegeId" label="所属学院" min-width="180">
        <template slot-scope="scope">
          {{ filterCollege(scope.row.collegeId) }}
        </template>
      </el-table-column>
      <el-table-column
        prop="createTime"
        label="首次获得积分时间"
        min-width="150"
      ></el-table-column>
      <el-table-column
        prop="usedIntegral"
        label="已使用积分"
        width="130"
      ></el-table-column>
      <el-table-column
        prop="surplusIntegral"
        label="剩余积分"
        width="130"
      ></el-table-column>
      <el-table-column prop="integralStatus" label="积分状态" width="130">
        <template slot-scope="scope">
          {{
            scope.row.integralStatus.toString() | filterName('integralStatus')
          }}
        </template>
      </el-table-column>
      <!--此处不能添加fixed="right"，会导致导出表格数据重复-->
      <el-table-column label="操作" width="220" fixed="right">
        <template slot-scope="scope">
          <el-button
            type="text"
            @click="showDetail(scope.row.dpAccount)"
            v-permission="'wh:integralList:checkDetail'"
          >
            查看详情
          </el-button>
          <el-button
            type="text"
            @click="frozen(scope.row.dpAccount)"
            v-if="!scope.row.integralStatus"
            v-permission="'wh:integralList:frozen'"
          >
            冻结积分
          </el-button>
          <el-button
            type="text"
            @click="unfreezing(scope.row.dpAccount)"
            v-if="scope.row.integralStatus"
            v-permission="'wh:integralList:unfrozen'"
          >
            解冻积分
          </el-button>
          <el-button
            type="text"
            @click="showDialog(scope.row)"
            v-permission="'wh:integralList:update'"
          >
            修改积分
          </el-button>
        </template>
      </el-table-column>
    </el-table>
    <!--分页-全局组件-->
    <pageCom
      :searchParams="searchParams"
      :total="total"
      @searchList="searchList"
    ></pageCom>
    <!-- 修改积分弹窗 -->
    <editDialog
      v-if="editDialogData.isShow"
      :dialog-data="editDialogData"
      @refresh="refresh"
    ></editDialog>
    <!-- 查看详情弹窗 -->
    <detailDialog
      v-if="detailDialogData.isShow"
      :dialog-data="detailDialogData"
    ></detailDialog>
    <!-- 批量冻结积分/批量修改积分，弹窗 -->
    <importDialog
      v-if="importDialogData.isShow"
      :dialog-data="importDialogData"
      @refresh="refresh"
      @showError="showError"
    >
      <template v-slot:tips>上传文件数据上限为3000</template>
    </importDialog>
    <!-- 修改失败弹窗 -->
    <errorDialog
      v-if="errorDialogData.isShow"
      :dialog-data="errorDialogData"
      :from="errorFrom"
    ></errorDialog>
  </div>
</template>
<script>
import topSearch from '@component/intergralManagement/integralList/topSearch' // 上部搜索条件
import importDialog from '@common/importDialog' // 导入弹窗
import errorDialog from '@common/errorDialog' // 导入失败弹窗
import editDialog from '@component/intergralManagement/integralList/editDialog' // 编辑弹窗
import detailDialog from '@component/intergralManagement/integralList/detailDialog' // 查看详情弹窗
import { saveScrollMixins } from '@/mixins/saveScroll'
import {
  getIntegralsList,
  importSetUrl,
  downSetUrl,
  downFreezeUrl,
  freeze,
  importFreezeUrl,
  unfreeze,
  unfreezeBatch
} from '@/api/couponsIntegral/integrals'
import { sysNormalDisable } from '@utils/dictionariesFunc'
import { getKeyValue } from '@/api/system/parameter' // 接口

export default {
  name: 'integralList',
  msg: '用户成长体系-积分列表',
  mixins: [saveScrollMixins],
  components: {
    topSearch,
    importDialog,
    editDialog,
    detailDialog,
    errorDialog
  },
  data() {
    return {
      loading: false,
      total: 0,
      // 搜索条件
      formInline: {
        integralStatus: '', // 积分状态
        usedIntegralGe: undefined, // 已使用积分大于等于
        usedIntegralLe: undefined, // 已使用积分小于等于
        surplusIntegralGe: undefined, // 剩余积分大于等于
        surplusIntegralLe: undefined, // 剩余积分小于等于
        dpAccount: '', // 用户大鹏号
        startTime: '', // 开始时间
        endTime: '', // 结束时间
        createTime: []
      },
      // 表格数据
      tableData: [],
      // 分页数据
      searchParams: {
        pageNum: 1, // 当前页数
        pageSize: 10 // 页面显示条数
      },
      // 传递给编辑弹框的数据
      editDialogData: {
        isShow: false, // 控制弹框显示
        params: {}, // 参数
        reasonLength: 0, //修改积分原因长度
        id: '' // 参数
      },
      detailDialogData: {
        isShow: false, // 控制弹框显示
        dpAccount: '' // 大鹏号
      },
      // 传递给导入弹框的数据
      importDialogData: {
        isShow: false, // 控制弹框显示
        downUrl: '', // 控制弹框显示
        params: '' // 参数
      },
      // 导入失败弹框的数据
      errorDialogData: {
        isShow: false, // 控制弹框显示
        warningText: '' // 参数
      },
      errorFrom: '', //批量修改积分/批量冻结积分，导入失败后的传参，用来判断调用哪个下载错误数据的接口
      // 选择框选中的数据
      multipleSelection: []
    }
  },
  activated() {
    this.toTableScrollHeight()
  },
  mounted() {
    this.getStatusList()
    this.getReasonLength()
    this.$nextTick(() => {
      setTimeout(() => {
        this.setTableScrollHeight()
      }, 1000)
    })
  },
  methods: {
    /* 获取学院状态 */
    async getStatusList() {
      // 学院
      await sysNormalDisable('sys_college', 'sysCollege')
      this.searchList()
    },
    /*获取变更原因长度*/
    getReasonLength() {
      let obj = {
        configKey: 'integral_change_reason_constraints'
      }
      getKeyValue(
        obj,
        (response) => {
          this.editDialogData.reasonLength = response
        },
        (response) => {
          this.$message({
            message: response.message,
            type: 'warning'
          })
        }
      )
    },
    /* 获取列表 */
    searchList() {
      this.loading = true
      let obj = Object.assign({}, this.searchParams, this.formInline)
      delete obj.createTime
      let params = obj
      getIntegralsList(
        params,
        (response) => {
          this.loading = false
          this.tableData = response.rows
          this.total = response.total
        },
        (response) => {
          this.loading = false
          this.$message({
            message: response.message,
            type: 'warning'
          })
        }
      )
    },
    //返回所属学院
    filterCollege(ids) {
      let ary = ids ? ids : []
      let str = ''
      let _this = this
      ary.forEach((item) => {
        str += _this.$options.filters.filterName(item, 'sysCollege') + '/'
      })
      str = str.substr(0, str.length - 1)
      return str
    },
    // 编辑
    showDialog(item) {
      this.editDialogData.isShow = true // 显示编辑弹框
      this.editDialogData.params = item
    },
    //查看详情
    showDetail(dpAccount) {
      this.detailDialogData.isShow = true // 显示编辑弹框
      this.detailDialogData.dpAccount = dpAccount
    },
    // 批量解除冻结
    unfreezingMultiple() {
      if (this.multipleSelection.length <= 0) {
        this.$message.warning('请至少选择一条数据！')
        return
      }
      this.$confirm(`解除后，用户积分账户立即恢复正常。`, '解除冻结', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        let ids = []
        this.multipleSelection.forEach((item) => {
          ids.push(item.dpAccount)
        })
        let obj = ids
        unfreezeBatch(
          obj,
          (response) => {
            this.searchList()
          },
          (response) => {
            this.$message.warning('批量解冻失败,' + response.message)
          }
        )
      })
    },
    // 单个解除冻结
    unfreezing(dpAccount) {
      this.$confirm(`解除后，用户积分账户立即恢复正常。`, '解除冻结', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        let obj = {
          dpAccount: dpAccount
        }
        unfreeze(
          obj,
          (response) => {
            this.searchList()
          },
          (response) => {
            this.$message.warning('删除失败,' + response.message)
          }
        )
      })
    },
    /*冻结积分*/
    frozen(dpAccount) {
      this.$confirm('冻结后，用户将不可使用积分，是否要继续？', '冻结', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      })
        .then(() => {
          let obj = {
            dpAccount: dpAccount
          }
          freeze(
            obj,
            (response) => {
              this.searchList()
            },
            (response) => {
              this.$message.warning('冻结失败,' + response.message)
            }
          )
        })
        .catch(() => {})
    },
    /*批量冻结/批量修改积分*/
    importBtn(type) {
      if (type === 'frozen') {
        //批量冻结积分
        this.importDialogData.url = importFreezeUrl() // 导入接口
        this.importDialogData.downUrl = downFreezeUrl() // 下载模板接口
        this.importDialogData.method = 'put' // 调用接口方法
        this.importDialogData.title = '冻结积分'
        this.errorFrom = 'freezeBatch'
      } else {
        //批量修改积分
        this.importDialogData.url = importSetUrl() // 导入接口
        this.importDialogData.downUrl = downSetUrl() // 下载模板接口
        this.importDialogData.method = 'put' // 调用接口方法
        this.importDialogData.title = '修改积分'
        this.errorFrom = 'integralsBatchEdit'
      }
      this.importDialogData.isShow = true // 显示导入弹框
    },
    /* 导入失败弹窗 */
    showError(text) {
      this.errorDialogData.isShow = true // 显示导入失败弹框
      this.errorDialogData.warningText = text // 显示导入失败弹框
    },
    /* 是否可勾选 */
    selectAble(row, index) {
      return row.integralStatus
    },
    /* table选择 */
    handleSelectionChange(val) {
      this.multipleSelection = val
    },
    /* 换页 */
    changePage(page) {
      this.searchParams.pageNum = page
      this.searchList()
    },
    /* 编辑后，刷新列表 */
    refresh() {
      this.searchList()
    },
    /* 搜索 */
    toSearch() {
      this.searchParams.pageNum = 1
      this.searchList()
    }
  }
}
</script>
<style lang="less">
#batchList {
  .gray {
    color: #666;
  }
  .table-conBtn {
    .el-dropdown {
      margin: 0 10px;
    }
  }
  .el-table {
    margin-top: 20px;
  }
}
</style>
